<template>
<div class="noprint">
	<div id="leftNav">
		<Menu class='leftMemu' accordion v-if="Object.keys(leftMenusData).length>0" :active-name="leftMenusData[0].secondSubMenuList[0].code" :open-names="[leftMenusData[0].code]" theme="dark" :style="leftMemuStyle">
			<Submenu v-for="(item,index) in leftMenusData" :name="item.code" :key="item.code">
				<template slot="title">
					<Icon type="ios-add-circle-outline" />
					{{item.name}}
				</template>
				<MenuItem @click.native="goto(`${item2.url},${item2.code}`)" v-for="(item2,index2) in item.secondSubMenuList" :name="item2.code" :key="item2.code">{{item2.name}}</MenuItem>
			</Submenu>
		</Menu>
	</div>
	</div>
</template>
<script>
  import {requestPost} from "../../utils/js/HttpUtil.js"
  import {mapGetters,mapMutations} from 'vuex'
	export default {
		name: 'leftNav',
		data() {
			return {
			  leftMenusData:{},
				leftMemuStyle: {
					height: ''
				},
        actions:{
			    getLeftMenusUrl:"/system/role/getUserSubMenusByCodeNum"
        }
			}
		},
		methods: {
		  ...mapMutations([
		    "setCode"
      ]),
			getHeight() {
				this.leftMemuStyle.height = window.innerHeight - 3.75 * 12 + 'px';
			},
      getleftNav(codeNum){
        requestPost(this.actions.getLeftMenusUrl, {codeNum:codeNum}, (data) => {
          this.leftMenusData = data.data;
          this.$router.push({name:this.leftMenusData[0].secondSubMenuList[0].url});
        })
      },
			goto(urlAndCode){
        var uc = urlAndCode.split(',');
        var url = uc[0];
        if (uc[0] != null && uc[0] != "null" && uc[0] != "" && uc[0] != undefined) {
          this.$router.push({name:url});
        }

			}

			
		},

		created() {
			window.addEventListener('resize', this.getHeight);
			this.getHeight()
		},
    computed:{
		  ...mapGetters([
		    "code"
      ])
    },
		mounted(){
			window.addEventListener('resize', this.getHeight);
			this.getHeight()
      let code = this.$route.query.code||this.code
      this.setCode(code)
      this.getleftNav(code);


		},

		destroyed() {
			window.removeEventListener('resize', this.getHeight)
		}

	}
</script>
<style>
	.leftMemu{
		/* width: 10rem !important; */
		overflow: auto;
		width: 100% !important;
	}
	#leftNav{
		width: 100%;
		/* float: left; */
	}
	@media print{
   .noprint{
       display:none;
   }
   .print{
       display:block;
   }
}
</style>
